function getUploadImgWidget(
    {
        callback = Function(),
        imageUrls = [],
        maxCount = 100,
        maxSize = 0,
        accept = "image/*",
        loading = true,
        uploadApiUrl = "/File/uploadImage",
        otherParam = {}
    }
) {
    const $dom = $(`<ul class="eval-img-ul" style="position: unset !important;"></ul>`);
    if (imageUrls) {
        imageUrls.forEach(url => {
            $dom.append(getImageCard(url));
        })

        callback(imageUrls);
    }

    if (imageUrls.length < maxCount) {
        $dom.append(getAddBtn());
    }

    $dom.addImageUrl = (url) => {
        imageUrls.push(url);

        const $addBtn = $dom.find('[data-btn="addImg"]');
        const imageCard = getImageCard(url);
        if ($addBtn.length) {
            $addBtn.before(imageCard);
            if (imageUrls.length >= maxCount) {
                $addBtn.remove();
            }

        } else {
            $dom.append(imageCard);
        }

        callback(imageUrls);
    }
    return $dom;


    function getImageCard(url) {
        const $card = $(`
            <li>
                <a data-lightbox="example-set" href="${url}">
                    <img src="${url}" alt="">
                </a>
                <i data-btn="del" class="img-del bi-x"></i>
            </li>
        `);

        $card.find('[data-btn="del"]').on("click", () => {
            imageUrls.splice(imageUrls.findIndex(item => item === url), 1);
            $card.remove();

            if ($dom.find('[data-btn="addImg"]').length === 0) {
                if (imageUrls.length < maxCount) {
                    $dom.append(getAddBtn());
                }
            }

            callback(imageUrls);
        });


        return $card;
    }


    function getAddBtn() {
        const $btn = $(`
            <li data-btn="addImg" class="img-add">
                <i class="bi-plus-lg"></i>
            </li>
        `);

        $btn.on("click", () => {
            uploadFile({
                uploadApiUrl,
                maxCount,
                maxSize: maxSize - imageUrls.length,
                accept,
                loading,
                otherParam,
                callback(res) {
                    if (res.Code !== 10000) {
                        return $.toast(res.Message);
                    }
                    const imageList = res.Result;
                    imageList.forEach(url => {
                        $btn.before(getImageCard(url));
                        imageUrls.push(url);
                    });

                    callback(imageUrls)

                    if (imageUrls.length >= maxCount) {
                        $btn.remove();
                    }
                }
            })
        });

        return $btn;
    }

}